横罫線の描画
今週は、ホームページ作成の初心者を対象にホームページの基本を紹介します。テーマは「横罫線の描画」です。ホームページでは、横罫線で内容を区切るケースがよくあります。この横罫線は、「HR」タグを記述するだけで描画できます。

→ 横罫線の描画と横罫線の高さ
 
ホームページを見ていると、立体化された横罫線で内容を区切っているページをいくつも発見できると思います。こういった横罫線は、HTMLに「HR」タグを記述するだけで描画できます。最も手軽に作成できる区切り線として非常に重宝する存在なので、ぜひとも覚えておきましょう。また「HR」タグにsize属性を追加し、横罫線の高さをピクセル数で指定することも可能です。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>
<BR>
ページの内容に区切りを付ける場合、最も手軽なのが横罫線です。その描画方法は、横罫線を描画したい位置に「HR」タグを挿入するだけ。すると、以下のような横罫線が描画されます。
<HR>
また横罫線は、その高さを指定することも可能です。高さを指定する場合は、size属性を追加し、ピクセル数で高さを指定します。以下に、いくつかの例を紹介しておきましょう。
<BR><BR>

・以下は高さ5ピクセルの横罫線です。
<HR size="5">
<BR>

・以下は高さ10ピクセルの横罫線です。
<HR size="10">
<BR>

・以下は高さ15ピクセルの横罫線です。
<HR size="15">
<BR>

・以下は高さ20ピクセルの横罫線です。
<HR size="20">
<BR>

・以下は高さ30ピクセルの横罫線です。
<HR size="30">
<BR>
</BODY>

</HTML>


→ 横罫線の幅の指定
 
「HR」タグでは、ページ幅いっぱいに横罫線が描画されるのが普通です。しかし、この“横罫線の幅”を各自が自由に変更することも可能です。“横罫線の幅”は、width属性を使ってピクセル数で指定します。また、同じwidth属性を使って、ページの横幅に対する割合（％）で横罫線の幅を指定することも可能です。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>
横罫線は、その幅をwidth属性で指定できます。指定方法はピクセル数、またはページ幅に対する割合（％）の2種類が用意されています。これらの違いは、ブラウザのウィンドウサイズを変化させると、よく理解できます。どちらも活用できる指定方法なので、覚えておくようにしましょう。<BR>
<BR><BR>

・以下は幅が200ピクセルの横罫線です。
<HR width="200">
<BR>

・以下は幅が300ピクセルの横罫線です。
<HR width="300">
<BR>

・以下は幅が400ピクセルの横罫線です。
<HR width="400">
<BR>

・以下は幅が50％ピクセルの横罫線です。
<HR width="50%">
<BR>

・以下は幅が75％ピクセルの横罫線です。
<HR width="75%">
<BR>

・以下は幅が100％ピクセルの横罫線です。
<HR width="100%">
<BR>
</BODY>

</HTML>


→ 横罫線の位置揃え
 
横罫線の幅を変更すると確認できるように、通常、横罫線は中央揃えで描画されます。横罫線の描画位置を変更したい場合は、align属性を追加するとよいでしょう。align属性に「left」を指定すると左揃え、「right」を指定すると右揃えの横罫線を描画できます。先ほど紹介した“高さ”や“幅”の指定も同時に行えば、横罫線を自由自在にカスタマイズできると思います。さらに「HR」タグ内にnoshadeと記述すると、平面の横罫線が表示されます。またInternet Explorerでは、coloro属性で横罫線の色を指定することも可能となっています（Netscape Navigatorはcolor属性に対応していません）。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>
横罫線は、その幅をwidth属性で指定できます。指定方法はピクセル数、またはページ幅に対する割合（％）の2種類が用意されています。これらの違いは、ブラウザのウィンドウサイズを変化させると、よく理解できます。どちらも活用できる指定方法なので、覚えておくようにしましょう。<BR>
<BR><BR>

・以下は、高さ5ピクセル、幅300ピクセル、左揃えの横罫線です。
<HR size="5" width="300" align="left">
<BR>

・以下は、高さ10ピクセル、幅80％、右揃えの横罫線です。
<HR size="10" width="80%" align="right">
<BR>

・以下は、高さ10ピクセル、幅80％、平面の横罫線です。
<HR size="10" width="80%" noshade>
<BR>

・以下は、高さ7ピクセル、幅75％、左揃え、赤色の横罫線です。<BR>
  （※Netscape Navigatorでは、赤色の横罫線になりません）
<HR size="7" width="75%" align="left" color="red">
<BR>
</BODY>

</HTML>


�e�����[�N����EC�i�r Yahoo �y�V LINE���f�[�^�����[�������z500�~�`�I
�����z�[���y�[�W �������N���W�b�g�J�[�h �C�O�i���q�����@�C�O���s�����������I �C�O�z�e��